﻿<script type="text/javascript" src="@Url.Content("/BaseResource/Plugin/codemirror/lib/codemirror.js")"></script>
<script type="text/javascript" src="@Url.Content("/BaseResource/Plugin/codemirror/mode/javascript/javascript.js")"></script>
<script type="text/javascript" src="@Url.Content("/BaseResource/Plugin/codemirror/mode/sql/sql.js")"></script>
<link type="text/css" href="@Url.Content("/BaseResource/Plugin/codemirror/lib/codemirror.css")" rel="stylesheet" />
<style>
    .CodeMirror {
        border: 1px solid #ccc;
        font-size: 13px;
    }
    .nameBox {
            border-style: solid;
            border-width: 1px;
            border-color: #95B8E7;
            cursor: pointer;
        }
</style>
<div class="datagrid-toolbar formToolBar">
    <a href="#" class="easyui-linkbutton" plain="true" onclick="save()" iconcls="iconfont iconfont-baocun">保存</a>
</div>
<div style="padding:2px;">
    <form method="post">
        <input id="Id" name="Id" type="hidden" />
        <table class="groupTable">
            <tr>
                <td style="width:15%">编号:</td>
                <td style="width:35%">
                    <input id="UICode" name="UICode" class="easyui-textbox" data-options="required:true" style="width:100%" />
                </td>
                <td style="width:15%">
                    名称:
                </td>
                <td style="width:35%">
                    <input id="Name" name="Name" class="easyui-textbox" style="width:100%" />
                </td>
            </tr>
            <tr>
                <td style="width:15%">数据库:</td>
                <td style="width:35%">
                    <input id="ModuleName" name="ModuleName" class="easyui-textbox" data-options="disabled:true" style="width:100%" />
                </td>
                <td style="width:15%">
                    类别:
                </td>
                <td style="width:35%">
                    <input id="MainTypeFullId" name="MainTypeFullId" class="easyui-combobox" data-options="valueField:'value',textField:'text',panelHeight:'auto',editable:false" style="width:100%" />
                </td>
            </tr>
            <tr>
                <td rowspan="2">
                    Script:
                </td>
                <td id="fieldGroup" style="padding:2px;word-break:break-all;line-height:20px" colspan="3">
                    
                </td>
            </tr>
            <tr>
                <td colspan="3">
                    <textarea id="Script" name="Script" style="width:100%;"></textarea>
                </td>
            </tr>
        </table>
    </form>
</div>
<script>
    var formData = {};
</script>
<script>
    var id = queryString('id');
    var scriptCodeMirror;
    var defineData = {};

    function initialCodeMirror() {
        scriptCodeMirror = CodeMirror.fromTextArea(document.getElementById('Script'), {
            mode: "text/javascript",
            lineNumbers: true,
            styleActiveLine: true,
            matchBrackets: true,
            theme: "xq-light"
        });
        scriptCodeMirror.setSize('auto', '200px');
    }

    function SetData(d) {

    }

    function pageLoad() {
        initialCodeMirror();
        //编辑
        if (id) {
            $("#Id").val(id);
            addAjaxParam("id", id);
            commitAjax("GetForm", {
                CallBack: function (data) {
                    if (data) {
                        formData = data;
                        $('#UICode').textbox('setValue', data.UICode);
                        $('#Name').textbox('setValue', data.Name);
                        $('#ModuleName').textbox('setValue', data.ModuleName);
                        $('#MainTypeFullId').textbox('setValue', data.MainTypeFullId);
                        scriptCodeMirror.setValue(removeEscapeStr(data.Script));
                        var url = '/AutoUI/ConfigUIDef/MainType/GetMainTypeList?ModuleName=' + data.ModuleName;
                        $('#MainTypeFullId').combobox('reload', url);

                    }
                }
            });

            addAjaxParam("formId", id);
            commitAjax("GetCtrlList", {
                CallBack: function (ctrlSettingObj) {
                    if (ctrlSettingObj) {
                        {
                            $.each(ctrlSettingObj, function (index, item) {
                                addFieldBox(item.FieldName, item.ColumnName);
                            })
                        }
                    }
                }
            })
        }
    }

    function save() {
        var isValid = $('form').form('validate');
        if (!isValid) {
            msgBox('请检查所填数据!');
            return;
        }

        var t = $('form').serializeArray();
        $.each(t, function () {
            formData[this.name] = this.value;
        });
        formData["Script"] = scriptCodeMirror.getValue();
        addAjaxParam("formData", formData);
        commitAjax("SaveForm", {
            CallBack: function (data) {
                if (data) {
                    closeWindow(true);
                }
                else {
                    msgBox('操作失败');
                }
            }
        })
    }

    function addFieldBox(fieldName, columnName) {
        var res = '';
        res += '<a class="nameBox" id="' + fieldName + '" onclick="selectFieldBox(this)">';
        res += fieldName;
        if (columnName && columnName != '') {
            res += '(' + columnName + ')';
        }
        res += '</a>&nbsp';
        $("#fieldGroup").append(res);
    }

    function selectFieldBox(obj) {
        scriptCodeMirror.replaceSelection(obj.id);
    }
</script>
